<template>
  <div class="app_container">
    <flex-container size="10px" style="background-color: white;" class="p-15">
      <div slot="header">
        <el-form :inline="true" :model="formInline" label-width="auto">
          <el-form-item label="登录账号">
            <el-input v-model="formInline.user" placeholder="审批人"></el-input>
          </el-form-item>
          <el-form-item label="师傅姓名">
            <el-select v-model="formInline.region" placeholder="活动区域">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="签约状态">
            <el-select v-model="formInline.region" placeholder="活动区域">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="师傅等级">
            <el-select v-model="formInline.region" placeholder="活动区域">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="账号状态">
            <el-select v-model="formInline.region" placeholder="活动区域">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="接单状态">
            <el-select v-model="formInline.region" placeholder="活动区域">
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="接单区域 (测试)">
            <address-selector multiple addrType="add" />
          </el-form-item>
          <!-- <el-form-item>
            <el-button type="primary" @click="onSubmit" icon="el-icon-search"
              >查询</el-button
            >
            <el-button type="">重置</el-button>
          </el-form-item> -->
        </el-form>
        <div>
          <el-button type="primary" icon="el-icon-plus" @click="dialogVisible = true">新增师傅</el-button>

          <el-button class="float-right" type="">重置</el-button>
          <el-button class="float-right" type="primary" @click="onSubmit" icon="el-icon-search">查询</el-button>
        </div>
      </div>
      <div class="h-full">
        <el-table :data="tableData" border style="width: 100%" height="100%">
          <el-table-column prop="date" label="登录账号" width="130" fixed align="center">
          </el-table-column>
          <el-table-column prop="name" label="工厂名称" width="130" fixed align="center">
          </el-table-column>
          <el-table-column prop="name" label="可用余额" width="" sortable="custom">
          </el-table-column>
          <el-table-column prop="name" label="暂冻结" width="" sortable>
          </el-table-column>
          <el-table-column prop="name" label="已结算" width="" sortable>
          </el-table-column>
          <el-table-column prop="name" label="总充值" width="" sortable>
          </el-table-column>
          <el-table-column prop="name" label="诚意金" width="" sortable>
          </el-table-column>
          <el-table-column prop="name" label="总提现" width="" sortable>
          </el-table-column>
          <el-table-column prop="name" label="是否认证" width="">
          </el-table-column>
          <el-table-column prop="name" label="账号状态" width="">
          </el-table-column>
          <el-table-column prop="name" label="入驻时间" width="" sortable>
          </el-table-column>
          <el-table-column prop="" label="操作" fixed="right" width="105" align="center">
            <template #default="{ row }">
              <el-button size="small" type="info" icon="el-icon-edit">编辑</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div slot="footer" class="h-full">
        <pagination :total="1000" />
      </div>
    </flex-container>

    <m-dialog :visible.sync="dialogVisible">
      12312312
    </m-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
      formInline: {
        user: "",
        region: ""
      },
      tableData: [
        {
          date: "2016-05-02",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄"
        },
        {
          date: "2016-05-04",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1517 弄"
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1519 弄"
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1516 弄"
        }
      ]
    };
  },
  methods: {
    onSubmit() {
      console.log("submit!");
    }
  }
};
</script>

<style lang="scss" scoped></style>
